<template>
  <h1>登录页面</h1>
  <div>
    <el-input v-model="username" placeholder="请输入用户名"></el-input>
    <el-input v-model="password" placeholder="请输入密码" type="password"></el-input>
  </div>
  <div>
    <el-button type="primary" @click="login">登录</el-button>
  </div>
</template>
<script setup>
import {ref} from 'vue'
import router from "../router/index.js";
import axios from "axios";
import {ElMessage} from "element-plus";

const username = ref('')
const password = ref('')
const login = () => {
  console.log(username.value, password.value)
  if (username.value === '' || password.value === '') {
    ElMessage.error('请输入用户名和密码')
  } else {
    axios.post(`http://localhost:8000/app/access_token/`, {username: username.value, password: password.value})
        .then(res => {
          console.log(res.data)
          ElMessage.success('登录成功')
          localStorage.setItem('token', res.data.access)
          localStorage.setItem('refresh', res.data.refresh)
          router.push('/')

        })

  }

}


</script>
